<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=800">
<style>
html { font-size: 16px; }
body { width: 800px; margin: 0; overflow-y: hidden; }
</style>

<script src="resources/autosizingTest.js"></script>

</head>
<body>

<table id="c1"><tr><td>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
    labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
    laboris ni si ut aliquip ex ea commodo consequat.
</td></tr></table>

<table id="c2" style="margin-left: 50px"><tr><td>
    Another comment.
</td></tr></table>

<script>

if (window.testRunner)
    testRunner.waitUntilDone();

setTimeout(function() {
    var forceLayout = document.body.offsetTop;

    var c3 = document.querySelector('#c2').cloneNode(true);
    c3.id = 'c3';
    c3.style.marginLeft = '100px';

    document.body.appendChild(c3);
    forceLayout = document.body.offsetTop;

    if (window.testRunner)
        testRunner.notifyDone();
}, 0);

</script>
</body>
</html>
